<template>
	<view class="">
		<view class="top-box">
			<view class="top-box-search">
				<u-navbar back-icon-color="#FFFFFF"  :background="background" :border-bottom="false">
					<view class="df aic">
						<view class="search fs24 c9 df aic"  @click="handleSearch">
							<u-icon name="search" color="#999999" class="mr10"></u-icon>请检索商品名
						</view>
					</view>
				</u-navbar>
			</view>
			<view class="box-categoryItem df aic">
				<view class="categoryItem curBox df aic jcc" >
					<view class="imgBox ">
						<u-image width="138" height="138" :src="platformGroupInfo.sceneImage" borderRadius="50%"></u-image>
					</view>
				</view>
				<view class="category-info ml20">
					<view class="fs32 c3 fw5">
						{{platformGroupInfo.groupName||''}}
					</view>
					<view class="fs24 mt8 c6 ">
						{{platformGroupInfo.groupRemark||''}}
					</view>
				</view>
			</view>
		</view>
		<view class="shopCart" @click="toShopCart">
			<u-badge absolute :offset="[5,0]" size="mini"
				:count="numAll" type="error">
			</u-badge>
			<image src="@/static/gwc.png" style="width: 88rpx;height: 88rpx;"></image>
		</view>
		<ScrollViewContent :platformGroupId="platformGroupInfo.platformGroupId" type="scene" @changeCarList="changeCarList" :cartList="goodsCarList"
			@handleLogin="handleLogin" ref="ScrollViewContent" :warpperHeightRight="warpperHeightRight"
			:bannerList="bannerList" :warpperHeight="warpperHeight"></ScrollViewContent>
		<LoginPopup @loginSuccess="loginSuccess" ref="LoginPopup"></LoginPopup>
	</view>
</template>

<script>
	import {
		bannerCode
	} from '@/api/common.js'
	import ScrollViewContent from './components/ScrollViewContent.vue'
	export default{
		components:{
			ScrollViewContent
		},
		data(){
			return{
				background:{ background:'transparent' },
				warpperHeight: 1000,
				warpperHeightRight: 1000,
				showSku:true,
				platformGroupInfo:{platformGroupId:''},
				bannerList: [],
				goodsCarList:[],
				numAll:0
			}
		},
		onLoad(e) {
			this.platformGroupInfo =JSON.parse(decodeURIComponent(e.info))
			console.log(this.platformGroupInfo)
		},
		onShow() {
			this.goodsCarList = uni.getStorageSync('CARGOODLIST')
			let num = this.$common.clacCount(this.goodsCarList)
			this.numAll = num
			this.$nextTick(() => {
				this.$refs.ScrollViewContent.clacGoodsSet()
			})
		},
		// onHide() {
		// 	this.$u.vuex('CARGOODLIST', JSON.parse(JSON.stringify(this.goodsCarList)))
		// },
		// onUnload() {
		// 	this.$u.vuex('CARGOODLIST', JSON.parse(JSON.stringify(this.goodsCarList)))
		// },
		methods:{
			toShopCart(){
				uni.switchTab({
					url:'/pages/shopping/index'
				})
			},
			changeCarList(e) {
				this.goodsCarList = e
				uni.setStorageSync('CARGOODLIST',this.goodsCarList)
				let num = this.$common.clacCount(e)
				this.numAll = num
				if(num==0){
					uni.removeTabBarBadge({index:3})
				}else{
					uni.setTabBarBadge({
					  index: 3,
					  text: num
					})
				}
			},
			handleLogin() {
				this.$refs.LoginPopup.checkLogin()
			},
		
			handleSearch() {
				uni.navigateTo({
					url: '/pages/search/index'
				})
			},
			bannerCode() {
				bannerCode({
					bannerCode: 'b_class_banner'
				}).then(res => {
					this.bannerList = res.data
					if (this.bannerList.length) {
						this.warpperHeightRight = this.warpperHeightRight - uni.upx2px(110)
					}
				})
			},
		},
		async mounted() {
			this.$refs.ScrollViewContent.getMenuScene()
			let that = this
			uni.getSystemInfo({
				success: function(res) {
					that.warpperHeight = res.windowHeight - res.statusBarHeight - uni.upx2px((115) * 2) - (
						res.platform == 'ios' ? 44 : 48)
					that.warpperHeightRight = that.warpperHeight - uni.upx2px((42) * 2)
					console.log(that.warpperHeightRight)
					that.bannerCode()
				}
			});
		}
	}
</script>

<style lang="scss" scoped>
	.box-categoryItem{
		background: linear-gradient(90deg, #ECFFEB 0%, #FFF4F0 100%);
		padding: 38rpx 30rpx;
	}
	.imgBox{
		border: 4rpx solid white;
		border-radius: 50%;
	}
	.categoryItem{
		background: linear-gradient(180deg, #48A147 0%, #88D987 100%);
		border-radius: 50%;
		width: 155rpx;
		height: 155rpx;
	}
	.top-box-search{
		background: linear-gradient(180deg, #48A147 0%, #88D987 100%);
		// background-image:url('../../static/kind-bg.png');
		background-size: 100%;
	}
	.address{
		
	}
	.search{
		width: 463rpx;
		height: 58rpx;
		background: #FFFFFF;
		border-radius: 38rpx 38rpx 38rpx 38rpx;
		opacity: 1;
		
border: 1rpx solid #48A147;
		padding: 13rpx 30rpx;
	}
	.shopCart{
		position: fixed;
		bottom: 120rpx;
		right: 20rpx;
		z-index: 9;
		
	}
</style>